<template>
	<view>
		<view v-if="shows" :style="{opacity:stylehaddly}">
			<navs></navs>
		</view>
		<banner :userdatas="userdatas"></banner>
		<matter :userdatas="userdatas"></matter>
		<massage></massage>
	</view>
</template>

<script>
	import navs from './components/navs.vue'
	import banner from './components/bnnner.vue'
	import matter from './components/matter.vue'
	import massage from './components/message.vue'
	export default {
		data() {
			return {
				shows: false,
				stylehaddly: 0,
				pagesid:'',//点击传过来的id
				userdatas:{} ,//数据库中的数据
			}
		},
		components: {
			navs,
			banner,
			matter,
			massage
		},
		methods: {
			//监听页面滚动
			handScrool(top) {
				if (top > 90) {
					// console.log('dasdasd')
					let opacity = top / 170
					opacity = opacity > 1 ? 1 : opacity
					// console.log(opacity)
					this.stylehaddly = opacity
					this.shows = true
				} else {
					this.shows = false
				}
			},
			//根据id从数据库请求数据
			shujuid(pagesid){
				const db = wx.cloud.database()
				db.collection('userdata').where({
					_id:pagesid,
				}).get()
				.then(res=>{
					// console.log(res.data[0].datainfo)
					this.userdatas = res.data[0].datainfo
					
					// console.log(this.userdatas)
					
				}).catch(err=>{
					console.log(err)
				})
			},
		},
		//监听页面滚动
		onPageScroll(e) {
			// console.log(e)
			let top = e.scrollTop
			this.handScrool(top)
		},
		
		
		
		//点击跳转以后触发onload函数接收id值
		onLoad(e){
			// console.log(e)
			this.pagesid = e.id
			this.shujuid(this.pagesid)
		}
	}
</script>

<style>

</style>
